import { Allotment } from "allotment";
import 'allotment/dist/style.css'
import Header from "./components/Header";
import Materpail from "./components/Materrail";
import Settings from "./components/Settings";
import Editor from "./components/EditArea";

function LowcodeEditor() {

    return (
        <div className="h-[100vh] flex flex-col ">
            <div className="h-[60px] flex items-center border-b-[1px] border-[#000]">
                <Header></Header>
            </div>
            <Allotment>
                <Allotment.Pane preferredSize={240} maxSize={300} minSize={200}>
                    <Materpail />
                </Allotment.Pane>

                <Allotment.Pane>
                    <Editor></Editor>
                </Allotment.Pane>

                <Allotment.Pane preferredSize={300} maxSize={500} minSize={300}>
                    <Settings />
                </Allotment.Pane>
            </Allotment>
        </div>
    )
}
export default LowcodeEditor;